import store from '../vuex/store';
import Vue from "vue";
import EXIF from 'exif-js'; //用于获取拍摄图片的基本信息（例如：拍摄方向）
import {
  doImgUpload
} from '@/api/api';
export default function Uploader(fileList, fileDom) {
  this.fileList = fileList;
  this.fileDom = fileDom;
}
// dataUrl转为blob对象，用于formdata数据提交
function dataURItoBlob(dataurl) {
  var arr = dataurl.split(','),
    mime = arr[0].match(/:(.*?);/)[1],
    bstr = atob(arr[1]), //base-64编码过的字符串进行解码
    n = bstr.length,
    u8arr = new Uint8Array(n); //8 位无符号整数值的类型化数组
  while (n--) {
    u8arr[n] = bstr.charCodeAt(n);
  }
  return new Blob([u8arr], {
    type: mime
  });
}

//序列化Promise
function sequenceTasks(tasks) {
  var arr=[];
  function recordValue(value) {
    arr.push(value);
    return Promise.resolve(arr);
  }
  var pushValue = recordValue;
  return tasks.reduce(function (promise, task) {
    return promise.then(task).then(pushValue);
  }, Promise.resolve());
}

//上传
Uploader.prototype.doUpLoad = function (src) {
  var parr = [];
  if (this.fileList.length > 0) {
    for (var i = 0; i < this.fileList.length; i++) {
      let formData = new FormData();
      var blob = dataURItoBlob(this.fileList[i]["src"]);
      formData.append("files", blob);
      formData.append("fileType", "image");
      let p = function(){
        return doImgUpload(formData).catch(() => { store.commit('HIDE_LOADING'); return {attaId:""}; });
      }
      parr.push(p);
    }
  } else {
    store.commit('HIDE_LOADING')
  }
  if (parr.length > 0) {
    return sequenceTasks(parr).then((arrs) => {
      if(!arrs||arrs.length==0){
          store.commit('UPDATE_TOAST', {
            message: "服务器内部错误!!!"
          })
          return Promise.reject(null);
      }
      console.log(arrs)
      var fileids = arrs.map((item) => {
        return src == 'src' ? item.url : item.attaId;
      });
      var urls = arrs.map((item) => {
        return item.url;
      });
      for (var i = 0; i < fileids.length; i++) {
        if (fileids[i].length == 0) {
          store.commit('UPDATE_TOAST', {
            message: "服务器内部错误!!!"
          })
          return Promise.reject(null);
        }
      }
      var images = fileids.join(",");
      var urlstr = urls.join(",");
      return Promise.resolve([images,urlstr]);
    });
  } else {
    return Promise.resolve(null);
  }
}

Uploader.prototype.delFile = function (i) {
  this.fileList.splice(i, 1);
}

Uploader.prototype.compress = function (file, item) {
  store.commit('SHOW_LOADING')
  var reader = new FileReader();
  if (!file || !item) {
    store.commit('HIDE_LOADING')
    return;
  }
  reader.onload = function (e) {
    var image = new Image();
    image.src = e.target.result;
    image.onload = function () {
      // 图片原始尺寸
      var originWidth = this.naturalWidth;
      var originHeight = this.naturalHeight;
      // 最大尺寸限制，可通过设置宽高来实现图片压缩程度
      var maxWidth = 600,
        maxHeight = 1000;
      // 目标尺寸
      var targetWidth = originWidth,
        targetHeight = originHeight;
      // 图片尺寸超过400x400的限制
      if (originWidth > maxWidth || originHeight > maxHeight) {
        if (originWidth / originHeight > maxWidth / maxHeight) {
          // 更宽，按照宽度限定尺寸
          targetWidth = maxWidth;
          targetHeight = Math.round(maxWidth * (originHeight / originWidth));
        } else {
          targetHeight = maxHeight;
          targetWidth = Math.round(maxHeight * (originWidth / originHeight));
        }
      }
      // 缩放图片需要的canvas
      var canvas = document.createElement('canvas');
      var context = canvas.getContext('2d');
      // canvas对图片进行缩放
      canvas.width = targetWidth;
      canvas.height = targetHeight;
      // 清除画布
      context.clearRect(0, 0, targetWidth, targetHeight);
      // 获取图片的拍摄方向（通过Exit.js 插件）
      let orient;
      EXIF.getData(image, () => {
        orient = EXIF.getTag(this, 'Orientation');
      });
      // 因为ios手机拍摄上传的图片会出现旋转的hack，这里需要特殊处理
      // 如果图片顺时针旋转了90度则调整下
      if (orient === 6) {
        canvas.width = targetHeight;
        canvas.height = targetWidth;
        context.rotate(Math.PI / 2);
        // (0,-imgHeight) 从旋转原理图那里获得的起始点
        context.drawImage(this, 0, -targetHeight, targetWidth, targetHeight);
}else if(orient === 3) {
        context.rotate(Math.PI);
        context.drawImage(this, -targetWidth, -targetHeight, targetWidth, targetHeight);
}else if(orient === 8) {
        canvas.width = targetHeight;
        canvas.height = targetWidth;
        context.rotate(3 * Math.PI / 2);
        // (0,-imgHeight) 从旋转原理图那里获得的起始点
        context.drawImage(this, -targetWidth, 0, targetWidth, targetHeight);
} else {
    // 图片压缩
    context.drawImage(this, 0, 0, targetWidth, targetHeight);
}
      //压缩后的图片base64 url
      var newUrl = canvas.toDataURL('image/png');
      Vue.set(item, 'src', newUrl); //生成预览地址
      setTimeout(() => {
        store.commit('HIDE_LOADING')
      }, 1000);
    };
  };
  reader.readAsDataURL(file);
}
Uploader.prototype.checkCount = function (maxImgCount) {
  let file = this.fileDom.files;
  if (this.fileList.length + file.length > maxImgCount) {
    var msg = "最多只能上传" + maxImgCount + "张图片！";
    store.commit('UPDATE_TOAST', {
      message: msg
    })
    return false;
  }
  return true;
}

Uploader.prototype.fileChange = function (maxCount) {
    let file = this.fileDom.files;
    if (maxCount && !this.checkCount(maxCount)) {
      return this.fileList.length + file.length;
    }
    // store.commit('SHOW_LOADING')
    for (var i = 0; i < file.length; i++) {
      ((j) => {
        var obj = {
          file: file[j],
          src: ""
        }
        this.compress(file[j], obj);
        this.fileList.push(obj);
      })(i);
    }
    return this.fileList.length;
}
